﻿<!DOCTYPE html>
<!--[if IE 8]>			<html class="ie ie8"> <![endif]-->
<!--[if IE 9]>			<html class="ie ie9"> <![endif]-->
<!--[if gt IE 9]><!-->	<html> <!--<![endif]-->
	<head>

		<!-- Basic -->
		<meta charset="utf-8">
		<title>Portfolio - 2 Columns | Porto - Responsive HTML5 Template</title>
		<meta name="keywords" content="HTML5 Template" />
		<meta name="description" content="Porto - Responsive HTML5 Template">
		<meta name="author" content="Crivos.com">

		<!-- Mobile Metas -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0">

		<!-- Web Fonts  -->
		<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">

		<!-- Libs CSS -->
		<link rel="stylesheet" href="css/bootstrap.css">
		<link rel="stylesheet" href="css/fonts/font-awesome/css/font-awesome.css">
		<link rel="stylesheet" href="vendor/flexslider/flexslider.css" media="screen" />
		<link rel="stylesheet" href="vendor/fancybox/jquery.fancybox.css" media="screen" />
		<link rel="stylesheet" href="vendor/isotope/jquery.isotope.css" media="screen" />

		<!-- Theme CSS -->
		<link rel="stylesheet" href="css/theme.css">
		<link rel="stylesheet" href="css/theme-elements.css">

		<!-- Custom CSS -->
		<link rel="stylesheet" href="css/custom.css">

		<!-- Skin -->
		<link rel="stylesheet" href="css/skins/blue.css">

		<!-- Responsive CSS -->
		<link rel="stylesheet" href="css/bootstrap-responsive.css" />
		<link rel="stylesheet" href="css/theme-responsive.css" />

		<!-- Favicons -->
		<link rel="shortcut icon" href="img/favicon.ico">
		<link rel="apple-touch-icon" href="img/apple-touch-icon.png">
		<link rel="apple-touch-icon" sizes="72x72" href="img/apple-touch-icon-72x72.png">
		<link rel="apple-touch-icon" sizes="114x114" href="img/apple-touch-icon-114x114.png">
		<link rel="apple-touch-icon" sizes="144x144" href="img/apple-touch-icon-144x144.png">

		<!-- Head Libs -->
		<script src="vendor/modernizr.js"></script>

		<!--[if IE]>
			<link rel="stylesheet" href="css/ie.css">
		<![endif]-->

		<!--[if lte IE 8]>
			<script src="vendor/respond.js"></script>
		<![endif]-->

		<!-- Facebook OpenGraph Tags - Go to http://developers.facebook.com/ for more information.
		<meta property="og:title" content="Porto Website Template."/>
		<meta property="og:type" content="website"/>
		<meta property="og:url" content="http://www.crivos.com/themes/porto"/>
		<meta property="og:image" content="http://www.crivos.com/themes/porto/"/>
		<meta property="og:site_name" content="Porto"/>
		<meta property="fb:app_id" content=""/>
		<meta property="og:description" content="Porto - Responsive HTML5 Template"/>
		-->

	</head>
	<body>

		<div class="body">
			<header>
				<div class="container">
					<h1 class="logo">
						<a href="index.html">
							<img alt="Porto" src="img/logo.png">
						</a>
					</h1>
					<div class="search">
						<form class="form-search" id="searchForm" action="page-search-results.html" method="get">
							<div class="control-group">
								<input type="text" class="input-medium search-query" name="q" id="q" placeholder="Search...">
								<button class="search" type="submit"><i class="icon-search"></i></button>
							</div>
						</form>
					</div>
					<nav>
						<ul class="nav nav-pills nav-top">
							<li>
								<a href="about-us.html"><i class="icon-angle-right"></i>About Us</a>
							</li>
							<li>
								<a href="contact-us.html"><i class="icon-angle-right"></i>Contact Us</a>
							</li>
							<li class="phone">
								<span><i class="icon-phone"></i>(123) 456-7890</span>
							</li>
						</ul>
					</nav>
					<div class="social-icons">
						<ul class="social-icons">
							<li class="facebook"><a href="http://www.facebook.com/" target="_blank" title="Facebook">Facebook</a></li>
							<li class="twitter"><a href="http://www.twitter.com/" target="_blank" title="Twitter">Twitter</a></li>
							<li class="linkedin"><a href="http://www.linkedin.com/" target="_blank" title="Linkedin">Linkedin</a></li>
						</ul>
					</div>
					<nav>
						<ul class="nav nav-pills nav-main" id="mainMenu">
							<li class="dropdown">
								<a class="dropdown-toggle" href="index.html">
									Home
									<i class="icon-angle-down"></i>
								</a>
								<ul class="dropdown-menu">
									<li><a href="index.html">Revolution Slider</a></li>
									<li><a href="index-2.html">Nivo Slider</a></li>
								</ul>
							</li>
							<li>
								<a href="about-us.html">About Us</a>
							</li>
							<li class="dropdown">
								<a class="dropdown-toggle" href="#">
									Features
									<i class="icon-angle-down"></i>
								</a>
								<ul class="dropdown-menu">
									<li class="dropdown-submenu">
										<a href="#">Blog</a>
										<ul class="dropdown-menu">
											<li><a href="blog-full-width.html">Blog Full Width</a></li>
											<li><a href="blog-large-image.html">Blog Large Image</a></li>
											<li><a href="blog-medium-image.html">Blog Medium Image</a></li>
											<li><a href="blog-post.html">Single Post</a></li>
										</ul>
									</li>
									<li><a href="feature-grid-system.html">Grid System</a></li>
									<li><a href="feature-pricing-tables.html">Pricing Tables</a></li>
									<li><a href="feature-icons.html">Icons</a></li>
									<li><a href="feature-elements.html">Elements</a></li>
									<li><a href="feature-typograpy.html">Typograpy</a></li>
								</ul>
							</li>
							<li class="dropdown">
								<a class="dropdown-toggle" href="#">
									Portfolio
									<i class="icon-angle-down"></i>
								</a>
								<ul class="dropdown-menu">
									<li><a href="portfolio-2-columns.html">2 Columns</a></li>
									<li><a href="portfolio-3-columns.html">3 Columns</a></li>
									<li><a href="portfolio-4-columns.html">4 Columns</a></li>
									<li><a href="portfolio-single-project.html">Single Project</a></li>
								</ul>
							</li>
							<li class="dropdown">
								<a class="dropdown-toggle" href="#">
									Pages
									<i class="icon-angle-down"></i>
								</a>
								<ul class="dropdown-menu">
									<li><a href="page-full-width.html">Full width</a></li>
									<li><a href="page-left-sidebar.html">Left sidebar</a></li>
									<li><a href="page-right-sidebar.html">Right sidebar</a></li>
									<li><a href="page-custom-header.html">Custom Header</a></li>
									<li><a href="page-404.html">404 Error</a></li>
									<li><a href="page-team.html">Team</a></li>
									<li><a href="page-services.html">Services</a></li>
									<li><a href="page-careers.html">Careers</a></li>
									<li><a href="page-faq.html">FAQ</a></li>
									<li><a href="sitemap.html">Sitemap</a></li>
								</ul>
							</li>
							<li>
								<a href="contact-us.html">Contact Us</a>
							</li>
						</ul>
					</nav>
				</div>
			</header>

			<div role="main" class="main">

				<section class="page-top">
					<div class="container">
						<div class="row">
							<div class="span12">
								<ul class="breadcrumb">
									<li><a href="index.html">Home</a> <span class="divider">/</span></li>
									<li class="active">Portfolio</li>
								</ul>
							</div>
						</div>
						<div class="row">
							<div class="span12">
								<h2>2 Columns</h2>
							</div>
						</div>
					</div>
				</section>

				<div class="container">

					<h2>Portfolio</h2>

					<ul class="nav nav-pills sort-source" data-sort-id="portfolio" data-option-key="filter">
						<li data-option-value="*" class="active"><a href="#">Show All</a></li>
						<li data-option-value=".websites"><a href="#">Websites</a></li>
						<li data-option-value=".logos"><a href="#">Logos</a></li>
						<li data-option-value=".brands"><a href="#">Brands</a></li>
					</ul>

					<hr />

					<div class="row">

						<ul class="portfolio-list sort-destination" data-sort-id="portfolio">
							<li class="span6 isotope-item websites">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">SEO</span>
											<span class="thumb-info-type">Website</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item brands">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-1.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">Red Wine</span>
											<span class="thumb-info-type">Brand</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item logos">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-2.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">Man Running</span>
											<span class="thumb-info-type">Logo</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item websites">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-3.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">The Code</span>
											<span class="thumb-info-type">Website</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item websites">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">SEO</span>
											<span class="thumb-info-type">Website</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item brands">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-1.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">Red Wine</span>
											<span class="thumb-info-type">Brand</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item logos">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-2.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">Man Running</span>
											<span class="thumb-info-type">Logo</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
							<li class="span6 isotope-item websites">
								<div class="portfolio-item thumbnail">
									<a href="portfolio-single-project.html" class="thumb-info">
										<img alt="" width="560" height="375" src="img/projects/project-3.jpg">
										<span class="thumb-info-title">
											<span class="thumb-info-inner">The Code</span>
											<span class="thumb-info-type">Website</span>
										</span>
										<span class="thumb-info-action">
											<span title="Universal" href="#" class="thumb-info-action-icon"><i class="icon-link"></i></span>
										</span>
									</a>
								</div>
							</li>
						</ul>

					</div>

				</div>

			</div>

			<footer>
				<div class="container">
					<div class="row">
						<div class="footer-ribon">
							<span>Get in Touch</span>
						</div>
						<div class="span3">
							<h4>Newsletter</h4>
							<p>Keep up on our always evolving product features and technology. Enter your e-mail and subscribe to our newsletter.</p>

							<div class="alert alert-success hidden" id="newsletterSuccess">
								<strong>Success!</strong> You've been added to our email list.
							</div>

							<div class="alert alert-error hidden" id="newsletterError"></div>

							<form class="form-inline" id="newsletterForm" action="php/newsletter-subscribe.php" method="POST">
								<div class="control-group">
									<div class="input-append">
										<input class="span2" placeholder="Email Address" name="email" id="email" type="text">
										<button class="btn" type="submit">Go!</button>
									</div>
								</div>
							</form>
						</div>
						<div class="span3">
							<h4>Latest Tweet</h4>
							<div id="tweet" class="twitter">
								<p>Please wait...</p>
							</div>
						</div>
						<div class="span4">
							<div class="contact-details">
								<h4>Get in touch</h4>
								<ul class="contact">
									<li><p><i class="icon-map-marker"></i> <strong>Address:</strong> 1234 Street Name, City Name, United States</p></li>
									<li><p><i class="icon-phone"></i> <strong>Phone:</strong> (123) 456-7890</p></li>
									<li><p><i class="icon-envelope"></i> <strong>Email:</strong> <a href="mailto:mail@example.com">mail@example.com</a></p></li>
								</ul>
							</div>
						</div>
						<div class="span2">
							<h4>Follow Us</h4>
							<div class="social-icons">
								<ul class="social-icons">
									<li class="facebook"><a href="http://www.facebook.com/" target="_blank" data-placement="bottom" rel="tooltip" title="Facebook">Facebook</a></li>
									<li class="twitter"><a href="http://www.twitter.com/" target="_blank" data-placement="bottom" rel="tooltip" title="Twitter">Twitter</a></li>
									<li class="linkedin"><a href="http://www.linkedin.com/" target="_blank" data-placement="bottom" rel="tooltip" title="Linkedin">Linkedin</a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<div class="footer-copyright">
					<div class="container">
						<div class="row">
							<div class="span1">
								<a href="index.html" class="logo">
									<img alt="Porto Website Template" src="img/logo-footer.png">
								</a>
							</div>
							<div class="span7">
								<p>© Copyright 2013 by Crivos. All Rights Reserved.</p>
							</div>
							<div class="span4">
								<nav id="sub-menu">
									<ul>
										<li><a href="page-faq.html">FAQ's</a></li>
										<li><a href="sitemap.html">Sitemap</a></li>
										<li><a href="contact-us.html">Contact</a></li>
									</ul>
								</nav>
							</div>
						</div>
					</div>
				</div>
			</footer>
		</div>

		<!-- Libs -->
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
		<script>window.jQuery || document.write('<script src="vendor/jquery.js"><\/script>')</script>
		<script src="vendor/jquery.easing.js"></script>
		<script src="vendor/jquery.cookie.js"></script>
		<!-- <script src="master/style-switcher/style.switcher.js"></script> -->
		<script src="vendor/bootstrap.js"></script>
		<script src="vendor/selectnav.js"></script>
		<script src="vendor/twitterjs/twitter.js"></script>
		<script src="vendor/flexslider/jquery.flexslider.js"></script>
		<script src="vendor/jflickrfeed/jflickrfeed.js"></script>
		<script src="vendor/fancybox/jquery.fancybox.js"></script>
		<script src="vendor/jquery.validate.js"></script>
		<script src="vendor/isotope/jquery.isotope.js"></script>

		<script src="js/plugins.js"></script>

		<!-- Page Scripts -->

		<!-- Theme Initializer -->
		<script src="js/theme.js"></script>

		<!-- Custom JS -->
		<script src="js/custom.js"></script>

		<!-- Google Analytics: Change UA-XXXXX-X to be your site's ID. Go to http://www.google.com/analytics/ for more information. -->
		<!--
		<script>
			var _gaq = _gaq || [];
			_gaq.push(['_setAccount', 'UA-XXXXX-X']);
			_gaq.push(['_trackPageview']);

			(function() {
				var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
				ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
				var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
			})();
		</script>
		-->
	</body>
</html>
